echarts定点缩放地图 && 监听缩放与拖曳事件 | 您所在的位置:网站首页 › echarts map 卡顿 › echarts定点缩放地图 && 监听缩放与拖曳事件 |
需求:
地图下钻时,由最初比例,以数值最高的位置为中心,放大地图至1.5倍。 官方配置项: series-map. zoom Number 控制当前视角的缩放比例 series-map. scaleLimit Object 滚轮缩放的极限控制 series-map.scaleLimit. max number 缩放最大值 series-map.scaleLimit. min number 缩放最小值 series-map. center Array 当前视角的中心点,用经纬度表示 获取放大中心需求限定地图放大中心是数值最高省份的经纬度,也就是.json 文件中每个省份下的属性 "cp",即地理位置 参考文章:series-mapECharts 地图实现文字居中,即省份在对应地图的中心位置 监听缩放与拖曳事件用到了echarts的georoam事件,官方文档没有看到这个事件,这个事件能监听缩放与拖曳事件,话不多说直接上代码
myChart.on('georoam', function (params) { // 控制台打印数据的名称 console.log(params); });
georoam事件可以取到zoom值,但是是一个固定值,需要变通一下,通过getOption()方法取到当前zoom值,然后就可以通过判断zoom值做你想要做的事了嘿嘿嘿(手动狗头.), 当然代码肯定是要进行优化的,不然要卡顿,因为georoam能同时响应缩放和拖曳。不过我这里代码也勉强够用了。 参考文章:实现echarts地图监听缩放事件效果 获取地图缩放事件的例子
|
CopyRight 2018-2019 实验室设备网 版权所有 |